<template>
    <container class="custom-herder">
        <span class="header-title">Planner config</span>
        <el-sub-menu disabled="useRandomMap" index="1">
            <template #title>Shard</template>
            <el-menu-item v-for="item in shardOptions" :key="item.value" :index="item.value">{{ item.label }}</el-menu-item>
        </el-sub-menu>
        <el-input disabled="useRandomMap"></el-input>
    </container>
</template>

<script lang="ts" setup>
import { ref } from 'vue'

const shardOptions = [
    {value:0,label:'Shard 0'},
    {value:1,label:'Shard 1'},
    {value:2,label:'Shard 2'},
    {value:3,label:'Shard 3'},
]

const useRandomMap = ref(false)

</script>